<!DOCTYPE html>
<html>
	<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
	<title></title>
	<link rel="stylesheet" type="text/css" href="../../../js/bootstrap-3.3.7-dist/css/bootstrap.min.css" />
	<link rel="stylesheet" type="text/css" href="../../../css/footer.css" />
	<link rel="stylesheet" type="text/css" href="../kaoqin.css"/>
	<link rel="stylesheet" type="text/css" href="../../../css/swiper-3.4.2.min.css" />
	<script src="../../../js/flexible.min.js" type="text/javascript" charset="utf-8"></script>
	
	<script src="../../../js/jquery-2.2.3.min.js" type="text/javascript" charset="utf-8"></script>
	<script src="../../../js/layer-v3.1.0/layer/layer.js"></script>
	<link href="../../../js/layer-v3.1.0/layer/theme/default/layer.css" />
	
<style type="text/css">
	.btn-red{ 
	    float: left;
	    text-align: center;
	    font-size: 0.38rem;
	    border-radius: 10px;
	    border: 1px solid #e83023;
	    padding: 0.1rem 1.56rem;
	    color: #e93340;
	    background-color: #FFFFFF;
	    margin-bottom: 5px;
	}
	.btnhve{ background-color:#e83023; color:#fff;}
	.list1{
		position: relative;
		display: none;
		background-color: #FFFFFF;
	}
	.list2{
		position: relative;
		left: 0.416666rem;
		display: none;
		height: auto;
	}
	.list3{
		position: relative;
		left: 0.416666rem;
		display: none;
	}

	#content {
		padding-top: 1.3rem;
	}
	body{
		background-color: #F5F5F5;
	}
	
	/*样式*/
	.shenqing_main{
		width: 100%;
	}
	.shenqing_main li{
		height: 1.180555rem;
		padding-left: 0.388888rem;
		line-height: 1.180555rem;
		font-size: 0.38rem;
		border-bottom: 1px solid #EDEDED;
	}
	.shenqing_main li:nth-child(7){
		border: none;
	}
	.shenqing_main p{
		padding-left: 0.388888rem;
		line-height: 2em;
	}
	.shxq_btn{
		width: 100%;
		height: 1.361111rem;
		position: fixed;
		bottom: 1.33rem;
		margin: 0;
	}
	.shxq_btn li{
		width: 50%;
		float: left;
		height: 1.361111rem;
		border-top: 1px solid #DBDBDB;
	}
	.shxq_btn li a{
		display: block;
		height: 1.361111rem;
		line-height: 1.361111rem;
		font-size: 0.416666rem;
		width: 100%;
		text-align: center;
	}
	.shxq_btn li:nth-child(1) a{
		color: #E93440;
		background-color: white;
	}
	.shxq_btn li:nth-child(2) a{
		color: white;
		background-color: #E93440;
	}
</style>
	</head>
	<body>
		<div id="wrap">
			<div id="main">
				<div id="header">
					<a id="headImg" href="javascript:history.go(-1)"><img class="headImg" src="../../../images/12.png" /></a>
					<p id="headTitle" style="font-size: 16px;">刘小正</p>
				</div>
				<div id="content">
					<ul class="shenqing_main">
						<li>
							<b>申请类型：</b>请假申请
						</li>
						<li>
							<b>申请事项：</b>病假
						</li>
						<li>
							<b>开始时间：</b>2017-10-12 09:00
						</li>
						<li>
							<b>结束时间：</b>2017-10-18 09:00
						</li>
						<li>
							<b>时长：</b>6天
						</li>
						<li>
							<b>扣除积分：</b>-48积分
						</li>
						<li>
							<b>请假事由：</b>
						</li>
						<p>
							阑尾炎手术，需要做手术
						</p>
					</ul>
				</div>
			</div>
			
			<div id="btn-two" style="position: fixed;bottom: 1.319444rem; margin-left: 2%;">
					<div class="agree btn-red" style=" margin-right:0.2rem;">审核通过</div>
					<div class="reject btn-red">审核驳回</div>
			</div>

			<div class="cover alertReject" style="display: none;">
				<div class="showAlert" style=" font-size:0.38rem;width:7rem;height:5rem; background-color: #FFFFFF;position: absolute;top: 50%;left: 50%;margin-left: -3.5rem;margin-top: -2.236111rem;">
					<p style="width: 6rem; margin: 0 auto; border-bottom: 1px solid gainsboro;height:1rem; text-align: center;color: #e93340;line-height:1rem;">驳回理由（非必填）</p>
					<textarea   name="" style="background-color: #F7F7F7;border: 0;resize: none;width: 6rem;height: 2.7rem;margin-left: 0.47rem;"></textarea>
					<div class="rejectSumbit" style="width: 3rem;height: 0.8rem;border: 1px solid #e93340;color: #e93340;text-align: center;line-height: 0.8rem;font-size: 0.4rem;border-radius: 0.25rem;margin: 0 auto; margin-top: 0.277777rem ;">驳回</div>
				</div>
			</div>
			<div class="cover alertAgree" style="display: none;">
				<div class="showAlert" style="width:  6rem; font-size: 0.333333rem;height: auto; padding-bottom: 0.388888rem; background-color: #FFFFFF;position: absolute;top: 50%;left: 50%;margin-left: -3rem;margin-top: -2.236111rem;">
				   <li class="list-group-item" style="text-align: center; font-weight: bold;"><img width="18px" src="../image/gou.png" /> 审核通过，选择审核人</li>
				   <li class="list-group-item"> 复核人:
				   	<span id="shenheren">企业部总监 朱立坤  ▼</span>
				  	<ul class="list1">
				  		<li>▼ 吉林省智城智家科技有限公司 
				  			<ul class="list2">
				  				<li>▼ 董事长
				  					<ul class="list3">
				  						<li>董事长 孙泽慧</li>
				  					</ul>
				  				</li>
				  				<li>▼ 副总经理
				  					<ul class="list3">
				  						<li>副总经理 孙辉</li>
				  					</ul>
				  				</li>
				  				<li>▼ 渠道总监
				  					<ul class="list3">
				  						<li>渠道总监  李霞</li>
				  					</ul>
				  				</li>
				  				<li>▼ 朱立坤
				  					<ul class="list3">
				  						<li>企业部总监 朱立坤</li>
				  					</ul>
				  				</li>
				  				<li>▼ 渠道总监
				  					<ul class="list3">
				  						<li>渠道总监 闫峰</li>
				  					</ul>
				  				</li>
				  				
				  				<li>▼ 市场部经理
				  					<ul class="list3">
				  						<li>市场部经理 国鑫</li>
				  					</ul>
				  				</li>
				  				<li>▼ 产品经理
				  					<ul class="list3">
				  						<li>产品经理 谭善明</li>
				  					</ul>
				  				</li>
				  				<li>▼ 培训讲师
				  					<ul class="list3">
				  						<li>培训讲师 张金艳</li>
				  					</ul>
				  				</li>
				  				<li>▼ 网络推广
				  					<ul class="list3">
				  						<li>网络推广 马忠阳</li>
				  					</ul>
				  				</li>
				  			</ul>
				  		</li>
				  		
				  	</ul>	
				   </li>
				   <div class="agreeSumbit" style="width: 3rem;height: 0.8rem;border: 1px solid #e93340;color: #e93340;text-align: center;line-height: 0.8rem;font-size: 0.4rem;border-radius: 0.25rem;margin: 0 auto; margin-top: 0.277777rem ;">提交</div>
				</div>
			</div>
			
			<div id="foot" class="row">
				<a class="foot col-xs-3 col-sm-3" href="../index2.html">
					<img class="footImg" src="../../../images/guanlixuanzhong.png" />
					<p>管理</p>
				</a>
				<a class="foot col-xs-3 col-sm-3" href="../../coalition/colalition.html">
					<img class="footImg" src="../../../images/lianmengchushi.png" />
					<p>联盟</p>
				</a>
				<a class="foot col-xs-3 col-sm-3" href="../../store/store.html">
					<img class="footImg" src="../../../images/11.png" />
					<p>商城</p>
				</a>
				<a class="foot col-xs-3 col-sm-3" href="../../personage/personIndex.html">
					<img class="footImg" src="../../../images/13.png" />
					<p>我的</p>
				</a>
			</div>
		</div>

	</body>
	<script src="../../../js/jquery-2.2.3.min.js" type="text/javascript" charset="utf-8"></script>
	<script src="../../../js/bootstrap-3.3.7-dist/js/bootstrap.min.js" type="text/javascript" charset="utf-8"></script>
	<script src="../../../js/handlebars-v2.0.0.js" type="text/javascript" charset="utf-8"></script>
	<script src="../../../js/rhAdmin.js" type="text/javascript" charset="utf-8"></script>
	
	<script type="text/javascript">
	window.onload = function(){
		$(".reject").click(function(){
			$('.alertReject').css('display','block')
		})
		$('.rejectSumbit').click(function(){
			$('.alertReject').css('display','none')
			layer.msg('驳回成功')
			setTimeout(function(){window.location="../shjg/sqjg.html";},1000);
		})		
		$(".agree").click(function(){
			$('.alertAgree').css('display','block')
		})
		$('.agreeSumbit').click(function(){
			$('.alertAgree').css('display','none')
			layer.msg('提交成功')
			setTimeout(function(){window.location="../shjg/sqjg.html";},1000); 
		})
		
		$('#shenheren').on('click',function(){
			$('.list1').show();
			event.stopPropagation();
		})

		$('.list1>li').on('click',function(){
			if ($(this).children('.list2').is(":hidden")) {
				$(this).children('.list2').show()
			}else{
				$(this).children('.list2').hide()
			}
			event.stopPropagation();
		})
		$('.list2>li').on('click',function(){
			if ($(this).children('.list3').is(":hidden")) {
				$(this).children('.list3').show()
			}else{
				$(this).children('.list3').hide()
			}
			event.stopPropagation();
		})
		$('.list3>li').on('click',function(){
			$('#shenheren').html($(this).html())
			$('.list1').hide();
			event.stopPropagation();
		})		
	}
	$(function(){
	  $("#btn-two div").click(function(){
	    $("#btn-two div").eq($(this).index()).addClass("btnhve").siblings().removeClass("btnhve");
	  })
	})
	</script>
</html>